@charset "utf-8";

/*手机端*/
.Hmenu-btn {
	width: 26px;
	height: 72px;
	padding: 34px 0 0;
	cursor: pointer;
}
	.Hmenu-btn a {
		display: block;
		width: 100%;
		height: 3px;
		background-color: #666666;
		position: relative;
	}

		.Hmenu-btn a:before,
		.Hmenu-btn a:after {
			content: "";
			display: block;
			width: 100%;
			height: 3px;
			background-color: #666666;
			position: absolute;
			left: 0px;
		}

		.Hmenu-btn a:before {
			top: -8px;
		}

		.Hmenu-btn a:after {
			bottom: -8px;
		}

	.Hmenu-btn.cur a {
		-moz-animation: buttonAnimation 0.3s ease forwards;
		-webkit-animation: buttonAnimation 0.3s ease forwards;
		animation: buttonAnimation 0.3s ease forwards;
	}

		.Hmenu-btn.cur a:before {
			-moz-animation: buttonAnimationBefore 0.3s ease forwards;
			-webkit-animation: buttonAnimationBefore 0.3s ease forwards;
			animation: buttonAnimationBefore 0.3s ease forwards;
		}

		.Hmenu-btn.cur a:after {
			-moz-animation: buttonAnimationAfter 0.3s ease forwards;
			-webkit-animation: buttonAnimationAfter 0.3s ease forwards;
			animation: buttonAnimationAfter 0.3s ease forwards;
		}

@-moz-keyframes buttonAnimationBefore {
	0% {
		-moz-transform: translateY(0px) rotate(0);
		transform: translateY(0px) rotate(0);
	}

	50% {
		-moz-transform: translateY(8px) rotate(0);
		transform: translateY(8px) rotate(0);
	}

	100% {
		-moz-transform: translateY(8px) rotate(45deg);
		transform: translateY(8px) rotate(45deg);
	}
}

@-webkit-keyframes buttonAnimationBefore {
	0% {
		-webkit-transform: translateY(0px) rotate(0);
		transform: translateY(0px) rotate(0);
	}

	50% {
		-webkit-transform: translateY(8px) rotate(0);
		transform: translateY(8px) rotate(0);
	}

	100% {
		-webkit-transform: translateY(8px) rotate(45deg);
		transform: translateY(8px) rotate(45deg);
	}
}

@keyframes buttonAnimationBefore {
	0% {
		-moz-transform: translateY(0px) rotate(0);
		-ms-transform: translateY(0px) rotate(0);
		-webkit-transform: translateY(0px) rotate(0);
		transform: translateY(0px) rotate(0);
	}

	50% {
		-moz-transform: translateY(8px) rotate(0);
		-ms-transform: translateY(8px) rotate(0);
		-webkit-transform: translateY(8px) rotate(0);
		transform: translateY(8px) rotate(0);
	}

	100% {
		-moz-transform: translateY(8px) rotate(45deg);
		-ms-transform: translateY(8px) rotate(45deg);
		-webkit-transform: translateY(8px) rotate(45deg);
		transform: translateY(8px) rotate(45deg);
	}
}

@-moz-keyframes buttonAnimationAfter {
	0% {
		-moz-transform: translateY(0) rotate(0);
		transform: translateY(0) rotate(0);
	}

	50% {
		-moz-transform: translateY(-8px) rotate(0);
		transform: translateY(-8px) rotate(0);
	}

	100% {
		-moz-transform: translateY(-8px) rotate(-45deg);
		transform: translateY(-8px) rotate(-45deg);
	}
}

@-webkit-keyframes buttonAnimationAfter {
	0% {
		-webkit-transform: translateY(0) rotate(0);
		transform: translateY(0) rotate(0);
	}

	50% {
		-webkit-transform: translateY(-8px) rotate(0);
		transform: translateY(-8px) rotate(0);
	}

	100% {
		-webkit-transform: translateY(-8px) rotate(-45deg);
		transform: translateY(-8px) rotate(-45deg);
	}
}

@keyframes buttonAnimationAfter {
	0% {
		-moz-transform: translateY(0) rotate(0);
		-ms-transform: translateY(0) rotate(0);
		-webkit-transform: translateY(0) rotate(0);
		transform: translateY(0) rotate(0);
	}

	50% {
		-moz-transform: translateY(-8px) rotate(0);
		-ms-transform: translateY(-8px) rotate(0);
		-webkit-transform: translateY(-8px) rotate(0);
		transform: translateY(-8px) rotate(0);
	}

	100% {
		-moz-transform: translateY(-8px) rotate(-45deg);
		-ms-transform: translateY(-8px) rotate(-45deg);
		-webkit-transform: translateY(-8px) rotate(-45deg);
		transform: translateY(-8px) rotate(-45deg);
	}
}

@-moz-keyframes buttonAnimation {
	0% {
		background: #aaaaaa;
	}

	50% {
		background: rgba(255, 255, 255, 0);
	}

	100% {
		background: rgba(255, 255, 255, 0);
	}
}

@-webkit-keyframes buttonAnimation {
	0% {
		background: #aaaaaa;
	}

	50% {
		background: rgba(255, 255, 255, 0);
	}

	100% {
		background: rgba(255, 255, 255, 0);
	}
}

@keyframes buttonAnimation {
	0% {
		background: #aaaaaa;
	}

	50% {
		background: rgba(255, 255, 255, 0);
	}

	100% {
		background: rgba(255, 255, 255, 0);
	}
}


.Hmenu-btn-web.Hmenu-btn {
	display: none;
	padding: 24px 0 0;
	height: 50px;
	float: right;
}